{% extends "admin/base.html" %}

{% block content %}
<div class="jumbotron">
	<div class="container">
        <h1><b>{{ 'Statistics' if en else '统计数据' }}</b></h1>
	</div>
</div>
<div class="container">
	<div class="row d-flex align-items-center">
		<div class="col-md-4 text-right">
			<h5><b>{{ user_count }}</b> {{ 'users registered' if en else '注册用户' }}</h5>
			{% if get_config('user_mode') == 'teams' %}
			<h5><b>{{ team_count }}</b> {{ 'teams registered' if en else '注册队伍' }}</h5>
			{% endif %}
			<h5><b>{{ ip_count }}</b> {{ 'IP addresses' if en else 'IP 地址' }}</h5>
			<hr>
			<h5><b>{{ total_points }}</b> {{ 'total possible points' if en else '总可解答分数' }}</h5>
			<h5><b>{{ challenge_count }}</b> {{ 'challenges' if en else '道题目' }}</h5>
            {% if en %}
            {% if most_solved %}
            <h5><b>{{ most_solved }}</b> has the most solves with <br>{{ solve_data[most_solved] }} solves</h5>
            {% endif %}
            {% if least_solved %}
            <h5><b>{{ least_solved }}</b> has the least solves with <br>{{ solve_data[least_solved] }} solves</h5>
            {% endif %}
            {% else %}
            {% if most_solved %}
            <h5><b>{{ most_solved }}</b> 解出的人最多<br>有 {{ solve_data[most_solved] }}人解出</h5>
            {% endif %}
            {% if least_solved %}
            <h5><b>{{ least_solved }}</b> 解出的人最少<br>有 {{ solve_data[least_solved] }}人解出</h5>
            {% endif %}
            {% endif %}
		</div>

		<div class="col-md-8">
			<div id="solves-graph" class="d-flex align-items-center">
				<div class="text-center w-100">
					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
				</div>
			</div>
		</div>
	</div>

	<hr>

	<div class="row">
		<div class="col-md-12">
			<div id="score-distribution-graph" class="d-flex align-items-center">
				<div class="text-center w-100">
					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
				</div>
			</div>
		</div>
	</div>

	<hr>

	<div class="row">
		<div class="col-md-12">
			<div id="solve-percentages-graph" class="d-flex align-items-center">
				<div class="text-center w-100">
					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
				</div>
			</div>
		</div>
	</div>

	<hr>

	<div class="row">
		<div class="col-md-6">
			<div id="keys-pie-graph" class="d-flex align-items-center">
				<div class="text-center w-100">
					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
				</div>
			</div>
			<div class="text-center">
				<h5><b>{{ solve_count }}</b> {{ 'right submissions' if en else '正确提交' }}</h5>
				<h5><b>{{ wrong_count }}</b> {{ 'wrong submissions' if en else '错误提交' }}</h5>
			</div>
		</div>
		<div class="col-md-6">
			<div id="categories-pie-graph" class="d-flex align-items-center">
				<div class="text-center w-100">
					<i class="fas fa-circle-notch fa-spin fa-3x fa-fw spinner"></i>
				</div>
			</div>
		</div>
	</div>

</div>
{% endblock %}

{% block scripts %}
	<script defer src="{{ url_for('views.themes', theme='admin', path='js/echarts.bundle.js') }}"></script>
	<script defer src="{{ url_for('views.themes', theme='admin', path='js/graphs.js') }}"></script>
{% endblock %}

{% block entrypoint %}
	<script defer src="{{ url_for('views.themes', theme='admin', path='js/pages/statistics.js') }}"></script>
{% endblock %}
